var bgimgs={教堂:'images/bg.jpg'}

MiniKite = function(cmd_tag){
	var canvas = document.getElementById('canvas')
	window.ctx = canvas.getContext('2d')
	
	var cmd = tmpl(cmd_tag, {})
	document.getElementById("results").innerHTML=cmd
	function run(){
		new Function("obj","setInterval('ctx.clearRect(0,0,400,300);"+cmd+"',100)")()
	}
	return run
}

String.prototype.trim = function(){
	return this.replace(/^\s+|\s+$/g, "");
}
Sprite = function(img,x,y,width,height){
	if(x)this.x=x
	else this.x=0
	if(y)this.y=y
	else this.y=0
	if(width)this.width=width
	else this.width=32
	if(height)this.height=height
	else this.height=48
	
	this.frameX=0
	this.frameY=0
	this.frameWidth=32
	this.frameHeight=48
	this.img=new Image()
	this.img.src=img
}
Sprite.prototype.draw = function(ctx) {
	ctx.drawImage(this.img,this.frameX,this.frameY,
			this.frameWidth,this.frameHeight,
			this.x,this.y,this.width,this.height)
}
Sprite.prototype.move = function(dx,dy) {
	this.x+=dx
	this.y+=dy
	if(dx==0&&dy>0){
		this.frameY=0
	}
	if(dx==0&&dy<0){
		this.frameY=48*3
	}
	if(dx<0&&dy==0){
		this.frameY=48
	}
	if(dx>0&&dy==0){
		this.frameY=48*2
	}
	this.frameX+=32
	if(this.frameX>32*3)this.frameX=0
}

function drawBgImg(ctx,img){
	var bgimg=new Image()
	bgimg.src=bgimgs[img]
	ctx.drawImage(bgimg,0,0,400,300)
}

// Simple JavaScript Templating
// John Resig - http://ejohn.org/ - MIT Licensed
(function(){
  var cache = {};

  this.tmpl = function tmpl(str, data){
    // Figure out if we're getting a template, or if we need to
    // load the template - and be sure to cache the result.
    var fn = !/\W/.test(str) ?
      cache[str] = cache[str] ||
        tmpl(document.getElementById(str).value) :

      // Generate a reusable function that will serve as a template
      // generator (and which will be cached).
      new Function("obj",
        "var p=[],print=function(){p.push.apply(p,arguments);};" +

        // Introduce the data as local variables using with(){}
        "with(obj){p.push('" +

        // Convert the template into pure JavaScript
        str
          .replace(/场景 (.*)/g, '场景("$1");')
          .replace(/(.*)角色 (.*) (.*)/g, '角色("$1","$2","$3");')
          .replace(/[\r\t\n]/g, " ")
          // .split("<%").join("\t")
          // .replace(/((^|%>)[^\t]*)'/g, "$1\r")
          // .replace(/\t=(.*?)%>/g, "',$1,'")
          // .split("\t").join("');")
          // .split("%>").join("p.push('")
          // .split("\r").join("\\'")
      + "');}return p.join('');");

    // Provide some basic currying to the user
    return data ? fn( data ) : fn;
  };
})();

function 场景(img){
	drawBgImg(ctx,img)
}
function 角色(img,move,step){
	var sp = new Sprite('images/sp1.png',100,150)
	Sprite.apply(this,[0,10])
	sp.draw(ctx)
}

function _drawText(text, x, y, color) {
	var div = document.createElement('DIV');
	div.appendChild( document.createTextNode(text) );
	// div.style.fontSize = font_size;
	// div.style.fontFamily = font_family;
	div.style.color = color;
	div.style.margin = "0";
	div.style.padding = "0";
	div.style.position = "absolute";
	div.style.left = x.toString() + "px";
	div.style.top = y.toString() + "px";
	canvas.parentNode.appendChild(div);
}


